﻿<div id="demot" style="overflow: hidden; width: 978px; margin: auto">
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td align="center" valign="middle" id="marquePic1"><table border="0" cellpadding="0" cellspacing="0">
          #set($width=150)
          #set($height=150)
          #set($name="product")
          #set($limit=12)
          #set($itemCount = $biz.GetRollCount($name,$limit))
          #set($step=$biz.GetRollStep($itemCount,2))
          #foreach($item in $biz.GetList($name,$limit,"is_red=1"))
          #if($velocityCount%$step==1)
          <tr> #end
            <td><table style="margin-left:15px;">
                <tr>
                  <td align="center" valign="middle" width="$width" height="$height" style="border:1px solid #ccc;"><a href="$html.url('show',${item.id})" title="${item.title}"> <img src="${item.img_url}" alt="${item.title}" width="$width" height="$height" onload="ImgFix(this,$width,$height)" /> </a> </td>
                </tr>
                <tr>
                  <td align="center"> ${item.title}</td>
                </tr>
              </table></td>
            #if($velocityCount%$step==0) </tr>
          #end
          #end
        </table></td>
      <td id="marquePic2"></td>
    </tr>
  </table>
</div>
<script type="text/javascript">
    var speed3 = 30//速度数值越大速度越慢 
    var t = false;
    var id = "aa";
    document.getElementById("marquePic2").innerHTML = document.getElementById("marquePic1").innerHTML
    function Marquee() {
        if (document.getElementById("marquePic2").offsetWidth - document.getElementById("demot").scrollLeft <= 0)
            document.getElementById("demot").scrollLeft -= document.getElementById("marquePic1").offsetWidth
        else {
            document.getElementById("demot").scrollLeft++
        }
        t = false;
    }
    function RMarquee() {
        if (document.getElementById("demot").scrollLeft <= 0)
            document.getElementById("demot").scrollLeft += document.getElementById("marquePic2").offsetWidth
        else {
            document.getElementById("demot").scrollLeft--
        }
        t = true;

    }
    function clickdiv() {
        clearInterval(MyMar)
        Marquee();
    }
    function Rclickdiv() {
        clearInterval(MyMar)
        RMarquee();
    }
    var MyMar = setInterval(Marquee, speed3)
    document.getElementById("demot").onmouseover = function () { clearInterval(MyMar) }
    document.getElementById("demot").onmouseout = function () { if (t) { MyMar = setInterval(RMarquee, speed3) } else { MyMar = setInterval(Marquee, speed3) } } 
</script>
